<script setup>
import { onMounted, ref, shallowRef, inject } from "vue";
import { PhoneFilled, Position } from "@element-plus/icons-vue";
const getAssetsFile = inject("getAssetsFile");
</script>

<template>
	<div class="sideFooter">
		<div class="footerContent flex flex_center">
			<div class="contentDetail flex align_itemsCenter flex_center">
				<img :src="getAssetsFile('img/sider/logoFooter.png')" alt="" style="width: 105px; margin-right: 30px" />
				<div>
					<div class="detail flex align_itemsCenter">
						<n-icon :size="20" style="margin-right: 14px">
							<Position />
						</n-icon>
						地址: 成都市武侯区吉庆四路环球时代中心C座1805室
					</div>
					<div class="detail flex align_itemsCenter">
						<n-icon :size="20" style="margin-right: 14px">
							<PhoneFilled />
						</n-icon>
						电话: 028-86247079 17308031859
					</div>
					<div class="detail flex align_itemsCenter">
						<n-icon :size="20" style="margin-right: 14px">
							<Message />
						</n-icon>
						邮箱: 2449223497@qq.com
					</div>
					<div class="detail flex align_itemsCenter">
						<n-icon :size="20" style="margin-right: 14px">
							<Message />
						</n-icon>
						邮编: 614000
					</div>
				</div>
			</div>
		</div>
		<div class="copyright">
			<div class="flex flex_center align_itemsCenter" style="text-align: center; height: 38px">
				版权所有©四川省社会公共安全设备及器材制造行业协会&nbsp;
				<n-button color="#fff" href="https://beian.miit.gov.cn" size="tiny" tag="a" target="_blank" text>蜀ICP备2021024675号-1</n-button>
			</div>
		</div>
	</div>
</template>

<style scoped>
.sideFooter {
	height: 248px;
}
.footerContent {
	background: var(--primary-color);
	height: 210px;
}
.contentDetail {
	height: inherit;
	width: 644px;
}
.copyright {
	background: #333333;
	color: white;
	font-size: 12px;
	height: 38px;
}
.detail {
	margin-bottom: 20px;
	color: white;
	font-size: 14px;
}
</style>
